const webpack = require("webpack")
const path = require("path")
const HtmlPlugin = require("html-webpack-plugin")

module.exports = {
    entry:path.join(__dirname,"./src/main.js"),
    output:{
        path:__dirname + "/dist",
        filename:"main.js"
    },
    module:{
        rules:[
            {
                test:/\.js$/,
                loader:"babel-loader",
                options:{
                    presets:["@babel/preset-env"]
                }
            },
            {
                test:/\.css$/,
                use:["style-loader","css-loader"]
            },
            {
                test:/\.(sass|scss)$/,
                use:["style-loader","css-loader","sass-loader"]
            },
            {
                test:/\.(jpg|png|jpeg|gif)$/,
                loader:"file-loader",
            },
        ]
    },
    devServer:{
        port:8888,
        open:true,
        hot:true
    },
    plugins:[
        new HtmlPlugin({
            template:"./index.html",
            filename:"index.html"
        }),
        new webpack.HotModuleReplacementPlugin()
    ]
}